<template>
	<view class="root">
		<view
			v-for="(msg, index) in messages"
			:key="index"
			class="ml-30 mr-30 mt-50"
			@click="to(index)"
		>
			<text class="fs-24 color-999 text-center">{{ msg.time }}</text>

			<view
				:style="{
					boxShadow: '0 0 8rpx 0 rgba(0, 0, 0, 0.1)',
					padding: '36rpx 30rpx',
				}"
				class="mt-30 br-24"
			>
				<text class="fs-34 color-1b1b1b">{{ msg.title }}</text>
				<text class="fs-24 color-999 multi-ellipsis lc-5 mt-20">
					{{ msg.content }}
				</text>

				<image
					:style="{
						height: '266rpx',
					}"
					class="width-100percent bgc-eee mt-30 br-12"
					:src="msg.img"
					mode="aspectFit"
				/>
			</view>
		</view>
		<text
			v-if="!messages.length"
			:style="{ top: '50vh', transform: 'translateY(-50%)' }"
			class="absolute fs-32 color-7c838d pl-30 pr-30 as-center"
		>
			暂无通知信息
		</text>
	</view>
</template>

<script lang="ts">
	import { isAbsoluteURL } from "@/libs/utils";
	import Vue from "vue";
	import Component from "vue-class-component";

	@Component
	export default class order extends Vue {
		// component property

		messages: AnyObject[] = [];

		onLoad() {
			this.getData();
			uni.$on("receiveNotice", this.getData);
		}

		getData(payload: string = "") {
			this.request
				.get("/employee/noticeList", { type: 4 })
				.then(({ data }) => (this.messages = data));
		}

		to(index: number) {
			const msg = this.messages[index];

			isAbsoluteURL(msg.url) &&
				uni.navigateTo({
					url: `/pages/common/webView?url=${decodeURIComponent(msg.url)}`,
				});
		}
	}
</script>

<style lang="scss" scoped>
	// scss
</style>